import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';


class TimeRangePickerPopup extends StatefulWidget {
  final Function( String startTime , String endTime) onConfirm;
  TimeRangePickerPopup({super.key, required this.onConfirm});
  @override
  _TimeRangePickerPopupState createState() => _TimeRangePickerPopupState();
}

class _TimeRangePickerPopupState extends State<TimeRangePickerPopup> {
  int _startHour = 8;//默认开始时间
  int _endHour = 17;//默认结束时间
  //核心代码
  void _showTimeRangePicker() {
    int tempStart = _startHour;
    int tempEnd = _endHour;

    showCupertinoModalPopup(
      context: context,
      builder: (_) => Container(
        height: 300,
        color: Colors.white,
        child: Column(
          children: [
            // 顶部按钮
            Container(
              color: Colors.grey[200],
              padding: EdgeInsets.symmetric(horizontal: 16),
              height: 60,
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  CupertinoButton(
                    child: Text("取消"),
                    onPressed: () => Navigator.pop(context),
                  ),
                  CupertinoButton(
                    child: Text("确认"),
                    onPressed: () {
                      setState(() {
                        _startHour = tempStart;
                        _endHour = tempEnd;
                        widget.onConfirm(_startHour.toString(),_endHour.toString());
                      });
                      Navigator.pop(context);
                    },
                  ),
                ],
              ),
            ),
            // 滚轮部分
            Expanded(
              child: Row(
                children: [
                  // 开始时间
                  Expanded(
                    child: CupertinoPicker(
                      scrollController: FixedExtentScrollController(initialItem: tempStart),
                      itemExtent: 40,
                      onSelectedItemChanged: (index) {
                        tempStart = index;
                      },
                      children: List.generate(24, (i) => Center(child: Text('$i 时'))),
                    ),
                  ),
                  // 结束时间
                  Expanded(
                    child: CupertinoPicker(
                      scrollController: FixedExtentScrollController(initialItem: tempEnd),
                      itemExtent: 40,
                      onSelectedItemChanged: (index) {
                        tempEnd = index;
                      },
                      children: List.generate(24, (i) => Center(child: Text('$i 时'))),
                    ),
                  ),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }
  //解析选择的时间，增加 00:00
  String _formatHour(int hour) => hour.toString().padLeft(2, '0') + ":00";

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text("小时滚轮范围选择")),
      body: Center(
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            Text("选择的时间段：", style: TextStyle(fontSize: 18)),
            SizedBox(height: 10),
            Text("${_formatHour(_startHour)} — ${_formatHour(_endHour)}", style: TextStyle(fontSize: 24)),
            SizedBox(height: 20),
            ElevatedButton(
              onPressed: _showTimeRangePicker,
              child: Text("选择时间段"),
            ),
          ],
        ),
      ),
    );
  }
}